/*awesome little grey boxes that fall from the sky... stolen from Ext docs */

Extx.cmp.createBox = function(t, s) {
        return ['<div class="msg">',
                '<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>',
                '<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc"><h3>', t, '</h3>', s, '</div></div></div>',
                '<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>',
                '</div>'].join('');
}

Extx.cmp.createOopsBox = function(t, s) {
    return ['<div class="msg">',
            '<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>',
            '<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc"><h3>', t, '</h3>', s, '</div></div></div>',
            '<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>',
            '</div>'].join('');
}

Extx.cmp.createLoginBox = function(t, s, html) {
    return ['<div style="z-index:50000" class="oopsmsg">',
            '<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>',
            '<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc">' + html + '</div></div></div>',
            '<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>',
            '</div>'].join('');
}

Extx.cmp.loginWin = function(title, html, remove) {
    if (!Extx.cmp.msgCt) {
        Extx.cmp.msgCt = Ext.DomHelper.insertFirst(document.body, { id: 'msg-div' }, true);
    }
    Extx.cmp.msgCt.alignTo(document, 't-t');
    var s = String.format.apply(String, Array.prototype.slice.call(arguments, 1));
    loginWindow = Ext.DomHelper.append(Extx.cmp.msgCt, { html: Extx.cmp.createLoginBox(title, s, html) }, true);
    loginWindow.setStyle("z-index", "50000");    
    loginWindow.on("click", function() {
        //Ext.get(m).remove();
        //console.log(arguments)
    })
    if (remove) loginWindow.remove();
    else loginWindow.slideIn('t').pause(10);
    setTimeout("Ext.get('password').focus();", 700);
}       

Extx.cmp.msg = function(title, format, remove) {
    if (!Extx.cmp.msgCt) {
        Extx.cmp.msgCt = Ext.DomHelper.insertFirst(document.body, { id: 'msg-div' }, true);
    }
    Extx.cmp.msgCt.alignTo(document, 't-t');
    var s = String.format.apply(String, Array.prototype.slice.call(arguments, 1));
    var m = Ext.DomHelper.append(Extx.cmp.msgCt, { html: Extx.cmp.createBox(title, s) }, true);
    m.on("click", function() {
        Ext.get(m).remove();
    })
    if (remove) m.remove();
    else m.slideIn('t').pause(4).ghost("t", { remove: true });
}

Extx.cmp.oopsMsg = function(title, format, remove) {
    if (!Extx.cmp.msgCt) {
        Extx.cmp.msgCt = Ext.DomHelper.insertFirst(document.body, { id: 'oopsmsg-div' }, true);
    }
    Extx.cmp.msgCt.alignTo(document, 't-t');
    var s = String.format.apply(String, Array.prototype.slice.call(arguments, 1));
    var m = Ext.DomHelper.append(Extx.cmp.msgCt, { html: Extx.cmp.createOopsBox(title, s) }, true);    
    if (remove) m.remove();
    else m.slideIn('t').pause(30).ghost("t", { remove: true });
}

Extx.cmp.toastMsg = function(title, content, icon) {
      new Ext.ux.ToastWindow({
        title: title,
        html: content,
        width: 300,
        height: 200,
        iconCls: (icon)?icon:'error'
      }).show(document);  
}